Skip to content

Commit fc25e27

Browse files
authored
[zh-TW]: update API DOMParser (#27271)
1 parent de3a092 commit fc25e27

File tree

1 file changed

+24
-92
lines changed

1 file changed

+24
-92
lines changed
Lines changed: 24 additions & 92 deletions
Original file line numberDiff line numberDiff line change
@@ -1,116 +1,48 @@
11
---
22
title: DOMParser
33
slug: Web/API/DOMParser
4+
l10n:
5+
sourceCommit: 3e1b5277c6451e7d27ab628f23fb9702947a7a7b
46
---
57

6-
{{APIRef("DOM")}}{{SeeCompatTable}}
8+
{{APIRef("DOM")}}
79

8-
`DOMParser` 可以將XML或是HTML格式的字串轉成 DOM [文件](/zh-TW/docs/Web/API/Document)`DOMParser`的規格請參閱 [DOM 解譯與串流化](https://w3c.github.io/DOM-Parsing/)
10+
**`DOMParser`** 介面提供了從字串中解析 {{Glossary("XML")}} 或 {{Glossary("HTML")}} 原始碼成 DOM {{domxref("Document")}} 的能力
911

10-
請注意[XMLHttpRequest](/zh-TW/docs/Web/API/XMLHttpRequest)解譯的是 URL 連結內容裡的 XML HTML 文件
12+
若要執行相反的操作,也就是將 DOM 樹轉換成 XML HTML 原始碼,可以使用 {{domxref("XMLSerializer")}} 介面
1113

12-
## 產生一個 DOMParser
14+
若是 HTML 文件,也可以透過設定 {{domxref("Element.innerHTML")}} 和 {{domxref("Element.outerHTML", "outerHTML")}} 屬性的值,將 DOM 的部分內容替換為由 HTML 建立的新 DOM 樹。這些屬性也能被讀取,以擷取與對應 DOM 子樹相對應的 HTML 片段。
1315

14-
`new DOMParser()`」可產生 DOMParser
16+
請注意,{{domxref("XMLHttpRequest")}} 可以直接從可透過 URL 存取的資源解析 XML 與 HTML,並在其 {{domxref("XMLHttpRequest.response", "response")}} 屬性中回傳一個 `Document`
1517

16-
關於如何在 Firefox 外掛程式中產生 DOMParser,請參考 `nsIDOMParser` 文件
18+
> [!NOTE]
19+
> 請注意,像是 `<p>` 這樣的[區塊級元素](/zh-TW/docs/Glossary/Block-level_content),如果另一個區塊級元素嵌套在內部並在關閉 `<p>` 標籤之前被解析,則會自動關閉。
1720
18-
## 解譯 XML
21+
## 建構子
1922

20-
產生解譯物件後,請呼叫`parseFromString方法函式來將XML字串轉換成DOM物件`:
23+
- {{domxref("DOMParser.DOMParser","DOMParser()")}}
24+
- : 建立一個新的 `DOMParser` 物件。
2125

22-
```js
23-
var parser = new DOMParser();
24-
var doc = parser.parseFromString(stringContainingXMLSource, "application/xml");
25-
```
26+
## 實例方法
2627

27-
### 錯誤處理
28+
- {{domxref("DOMParser.parseFromString()")}}
29+
- : 使用 HTML 或 XML 解析器解析字串,並回傳一個 {{domxref("HTMLDocument")}} 或 {{domxref("XMLDocument")}}。
2830

29-
請注意如果解譯過程出錯,目前的 `DOMParser` 不會丟出異常物件(exception),但是會回傳一個錯誤文件(請看 [Firefox bug 45566](https://bugzil.la/45566)):
31+
## 範例
3032

31-
```xml
32-
<parsererror xmlns="http://www.mozilla.org/newlayout/xml/parsererror.xml">
33-
(error description)
34-
<sourcetext>(a snippet of the source XML)</sourcetext>
35-
</parsererror>
36-
```
33+
這個介面唯一的方法 {{domxref("DOMParser.parseFromString()")}} 的文件中,包含了用於解析 XML、SVG 和 HTML 字串的範例。
3734

38-
解譯錯誤也會記錄在錯誤終端機中([Error Console](/zh-TW/docs/Error_Console)), 紀錄裡頭的文件 URI (如下) 則為錯誤來源.
35+
## 規範
3936

40-
## 解譯 SVG 或 HTML 文件
41-
42-
`DOMParser` 也可以用來解譯 SVG 文件或是 HTML 文件。可以依 MIME 格式,輸出三種不同格式. 如果 MIME 格式是 `text/xml`,輸出的格式為 `XMLDocument`, 如果 MIME 格式是 `image/svg+xml`, 輸出格式為 `SVGDocument,` 如果 MIME 格式是 `text/html`, 輸出格式則為 `HTMLDocument`.
43-
44-
```js
45-
var parser = new DOMParser();
46-
var doc = parser.parseFromString(stringContainingXMLSource, "application/xml");
47-
// returns a Document, but not a SVGDocument nor a HTMLDocument
48-
49-
parser = new DOMParser();
50-
doc = parser.parseFromString(stringContainingXMLSource, "image/svg+xml");
51-
// returns a SVGDocument, which also is a Document.
52-
53-
parser = new DOMParser();
54-
doc = parser.parseFromString(stringContainingHTMLSource, "text/html");
55-
// returns a HTMLDocument, which also is a Document.
56-
```
57-
58-
### 其他瀏覽器可用的 DOMParser HTML 外掛程式
59-
60-
```js
61-
/*
62-
* DOMParser HTML extension
63-
* 2012-09-04
64-
*
65-
* By Eli Grey, http://eligrey.com
66-
* Public domain.
67-
* NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
68-
*/
69-
70-
/*! @source https://gist.github.com/1129031 */
71-
/*global document, DOMParser*/
72-
73-
(function (DOMParser) {
74-
"use strict";
75-
76-
var proto = DOMParser.prototype,
77-
nativeParse = proto.parseFromString;
78-
// Firefox/Opera/IE throw errors on unsupported types
79-
try {
80-
// WebKit returns null on unsupported types
81-
if (new DOMParser().parseFromString("", "text/html")) {
82-
// text/html parsing is natively supported
83-
return;
84-
}
85-
} catch (ex) {}
86-
87-
proto.parseFromString = function (markup, type) {
88-
if (/^\s*text\/html\s*(?:;|$)/i.test(type)) {
89-
var doc = document.implementation.createHTMLDocument("");
90-
if (markup.toLowerCase().indexOf("<!doctype") > -1) {
91-
doc.documentElement.innerHTML = markup;
92-
} else {
93-
doc.body.innerHTML = markup;
94-
}
95-
return doc;
96-
} else {
97-
return nativeParse.apply(this, arguments);
98-
}
99-
};
100-
})(DOMParser);
101-
```
102-
103-
### DOMParser from Chrome/JSM/XPCOM/Privileged Scope
104-
105-
See article here: [nsIDOMParser](/zh-TW/docs/nsIDOMParser)
37+
{{Specifications}}
10638

10739
## 瀏覽器相容性
10840

10941
{{Compat}}
11042

111-
## 參考資料
43+
## 參見
11244

113-
- [Parsing and serializing XML](/zh-TW/docs/Web/XML/Parsing_and_serializing_XML)
114-
- [XMLHttpRequest](/zh-TW/docs/Web/API/XMLHttpRequest)
115-
- [XMLSerializer](/zh-TW/docs/Web/API/XMLSerializer)
116-
- [Parsing HTML to DOM](/zh-TW/docs/Mozilla/Add-ons/Code_snippets/HTML_to_DOM)
45+
- [解析與序列化 XML](/zh-TW/docs/Web/XML/Guides/Parsing_and_serializing_XML)
46+
- {{domxref("XMLHttpRequest")}}
47+
- {{domxref("XMLSerializer")}}
48+
- {{jsxref("JSON.parse()")}}——用於 {{jsxref("JSON")}} 文件的對應方法。

0 commit comments

Comments
 (0)